<template>
  <div class="title">
    <!-- 插槽 -->
        <slot>
            <span>火爆推荐</span>
        </slot>
    </div>
</template>

<script>
export default {

}
</script>

<style scoped>
.title{
    padding: 1rem 0;
    width: 100%;
    text-align: center;
    font-size: 1rem;
}
.title span{
    position: relative;
}
.title span::before{
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: -2rem;
    margin-top: -0.25rem;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: #d4c0a7;
}
.title span::after{
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: -2rem;
    margin-top: -0.25rem;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: #d4c0a7;
}
</style>